﻿<Button OnClick="AppendData" BackgroundColor=TablerColor.Primary>Append Data</Button>

<DemoContainer>
    <ApexChart @ref=chart TItem="TimeSeries"
               Title="Order Net Value"
               XAxisType="XAxisType.Datetime">
<ChildContent>
        <ApexPointSeries TItem="TimeSeries"
                         Items="timeSeries"
                         Name="Value"
                         SeriesType="SeriesType.Line"
                         XValue="@(e => e.Date)"
                         YValue="@(e => e.Value)"
                         OrderBy="e=>e.X"
                         Stroke="@(new SeriesStroke { Width = 2, Color="#1F15E5"})" />

        <ApexPointSeries TItem="TimeSeries"
                         Items="timeSeries"
                         Name="Quantity"
                         SeriesType="SeriesType.Line"
                         XValue="@(e => e.Date)"
                         YValue="@(e => e.Quantity)"
                         OrderBy="e=>e.X"
                         Stroke="@(new SeriesStroke { Width = 2, Color="#E51534"})" />
    </ChildContent>
                     </ApexChart>
</DemoContainer>

@code {
    private ApexChart<TimeSeries> chart;
    private List<TimeSeries> timeSeries = new TimeSeriesGenerator(100).TimeSeries;


    private async Task AppendData()
    {
        var max = timeSeries.Max(e => e.Date);
        var rnd = new Random();

        var newData = new List<TimeSeries>();
        for (var i = 1; i <= 10; i++)
        {
            newData.Add(new TimeSeries { Date = max.AddDays(i), Quantity = rnd.Next(1, 20), Value = rnd.Next(1, 100) });
        }

        timeSeries.AddRange(newData);
        await chart.AppendDataAsync(newData);
    }
    }